function $(el) {
	var a = document.querySelectorAll(el);
	if(a.length > 1) {
		return a;
	} else {
		return a[0];
	}
}

var newX = 0;
var oldX = 0;
var lastX = 0;
var index = 0;
var w = picUL.children[0].offsetWidth;
picUL.addEventListener('touchstart', function(e) {
	lastX = 0;
	picUL.style.transition = '0s';
	oldX = e.touches[0].clientX;
}, false);
picUL.addEventListener('touchmove', function(e) {
	newX = e.touches[0].clientX;
	lastX = newX - oldX;
	picUL.style.transform = 'translateX(' + ((-index * w) + lastX) + 'px)';
//	console.log(lastX)
}, false);
picUL.addEventListener('touchend', function(e) {
	if(lastX < -50) {
		index++;
		if(index > picUL.children.length - 1) index = picUL.children.length - 1;
		picUL.style.transition = '0.3s';
		picUL.style.transform = 'translateX(' + (-index * w) + 'px)';
	} else if(lastX > 50) {
		index--;
		if(index < 0) index = 0;
		picUL.style.transition = '0.3s';
		picUL.style.transform = 'translateX(' + (-index * w) + 'px)';
	} else {
		picUL.style.transition = '0.3s';
		picUL.style.transform = 'translateX(' + (-index * w) + 'px)';
	}
}, false);

for(var i = 0; i < $('ol>li').length; i++) {
	$('ol>li')[i].index = i;
	picUL.addEventListener('touchend', function() {
		for(var i = 0; i < $('ol>li').length; i++) {
			$('ol>li')[i].className = '';
		}
		$('ol>li')[index].className = 'active';
	}, false);
}

window.onscroll = function(){
	var headPosi = document.body.scrollTop || document.documentElement.scrollTop;
	//document.title = headPosi;
	
	for(var i=0; i<$("#header>a").length; i++){
		if(headPosi > '50'){
			header.style.background = "rgba(250,250,250,1)";
			$("#header>a")[i].style.background = "rgba(0,0,0,0)";
			$("#header>a")[i].style.color = "#4e4d53";
		}else{
			header.style.background = "rgba(250,250,250,0)";
			$("#header>a")[i].style.background = "rgba(0,0,0,0.3)";
			$("#header>a")[i].style.color = "#fff";
		}
	}
	
	
}








